<template>
<div>
    <div>
        <van-calendar title="日历" :poppable="false" :show-confirm="false" :style="{ height: '500px' }" />
    </div>
    <div>
        <li>
            <div class="van-hairline--surround">
                <van-row gutter="20">
                    <van-col span="8"></van-col>
                    <van-col span="8 ">
                        <van-button round type="info" size="small" v-on:click="showPopup">查看</van-button>
                    </van-col>
                    <van-col span="8">
                        <van-button round type="info" size="small" v-on:click="add">预定</van-button>
                    </van-col>
                </van-row>

                <div style="margin-top: 30px">
                    <div style="margin-top: 30px">
                        <van-slider v-model=" am" bar-height="15px" active-color="#ee0a24" />
                    </div>
                    <div style="margin-top: 20px">
                        <van-slider v-model="pm" bar-height="15px" active-color="#ee0a24" />
                    </div>
                </div>

            </div>
        </li>
    </div>

    <div v-for="(f,index) in lists" :key="index">
        {{f.meetingRoom}}
    </div>

    <div>

        <van-popup v-model="show">
            <div>
                <van-cell-group>
                    <van-field label="会议名称" value="输入框只读" v-model="meetingName" readonly />
                    <van-field label="会议时间" value="输入框只读" v-model="currenTime" />
                    <van-field label="会议室" value="输入框只读" readonly />
                    <van-field label="主要领导" value="输入框只读" readonly />
                    <van-field label="主办单位" value="输入框只读" readonly />
                    <van-field label="申请人" value="输入框只读" readonly />
                </van-cell-group>
            </div>
        </van-popup>
    </div>

</div>
</template>

<script>
import {
    findList
} from "@/api/fy/index";

import request from '@/utils/request'
export default {
    data() {
        return {
            roomName: '',
            name: 'index',
            am: 80,
            pm: 50,
            show: false,
            lists: "",
            meetingName: "000",
            currenTime: "",
            currentDate: new Date()
        }

    },
    created() {
        this.currenTime = this.currentDate.getFullYear() +
            "-" +
            (Number(this.currentDate.getMonth()) + 1) +
            "-" +
            this.currentDate.getDate()

        const startTime ={
           startTime:this.currenTime
        }

        findList(startTime).then((response) => {
            console.log(response);
            this.lists = response.dayList
        })

        // findList(obj).then(function (res) {
        //         console.log(res);
        //         this.list = res.dayList
        //     })
        //     .catch(function (error) {
        //         console.log(error);
        //     });
    },
    methods: {

        add() {
            this.$router.push({
                path: "/add",
                query: {
                    id: "e"
                }
            })
            // <router-link to="/add"></router-link>
            //               <router-link to="{path:'/add', query:{id:1，name:'vue'}}" target="_blank">
            //   </router-link>
        },
        showPopup() {
            this.show = true;

        },

    }
}
</script>
